<template>
	<view>
		<!-- 话题切换 -->
		<topic-info :item="topicInfo"></topic-info>
		<!-- tab导航nav切换 -->
		<swiper-tab-head :tabBars="tabBars" :tabindex="tabindex" @tabtap="tabtap" scrollstyle="border-bottom:0;" scrollitem="width:50%;"></swiper-tab-head>
		<!-- 列表 -->
		<view class="topic-detail-list">
			<block v-for="(item,index) in tablist" :key="index">
				<template v-if="tabindex==index">
					<!-- 列表 -->
					<block v-for="(list,listindex) in item.list" :key="listindex">
						<common-list :item="list" :index="listindex"></common-list>
					</block>
					<!-- 上拉加载 -->
					<load-more :loadtext="item.loadtext"></load-more>
				</template>
			</block>
		</view>
	</view>
</template>

<script>
	import loadMore from "../../components/common/load-more.vue";
	import commonList from "../../components/common/common-list.vue";
	import topicInfo from '../../components/topic/topic-info.vue';
	import swiperTabHead from "../../components/index/swiper-tab.vue";
	export default {
		components: {
			topicInfo,
			swiperTabHead,
			commonList,
			loadMore
		},
		data() {
			return {
				topicInfo: {


					titlepic: "../../static/srcc/3.jpg",
					title: "Vincent",
					desc: "打代码很好，天天熬夜打怪兽",
					totalnum: 50,
					todaynum: 10
				},
				tabindex: 0,

				tabBars: [{
						name: '最新',
						id: 'zuixin'
					},
					{
						name: '最火',
						id: 'zuihuo'
					}
				],
				tablist: [{
						loadtext: "上拉加载更多",
						list: [{

								userpic: "../../static/srcc/touxiang.jpg",
								username: "Vincent",
								sex: 0, //0代表是男生，1代表女生
								age: 25,
								isguangzhu: false,
								title: "打代码666",
								titlepic: "../../static/srcc/c2.jpg",
								video: false,
								share: false,
								path: "深圳 龙岗",
								sharenum: 50,
								commentnum: 40,
								goodnum: 80

							},
							//视频的例子
							{
								userpic: "../../static/srcc/touxiang.jpg",
								username: "Vincent",
								sex: 1, //0代表是男生，1代表女生
								age: 25,
								isguangzhu: false,
								title: "打代码",
								titlepic: "../../static/srcc/c2.jpg",
								video: {
									looknum: "300万播放",
									long: "1.21"
								},
								share: false,
								path: "深圳 龙岗",
								sharenum: 50,
								commentnum: 40,
								goodnum: 80

							},

							//分享的例子
							{
								userpic: "../../static/srcc/touxiang.jpg",
								username: "Vincent",
								sex: 0, //0代表是男生，1代表女生
								age: 25,
								isguangzhu: false,
								title: "打代码",
								titlepic: "",
								video: false,
								share: {
									title: "哈哈哈打代码",
									titlepic: "../../static/srcc/c2.jpg"
								},
								path: "深圳 龙岗",
								sharenum: 50,
								commentnum: 40,
								goodnum: 80

							}


						]
					},
					{
						loadtext: "上拉加载更多",
						list: [
							// 文字
							{

								userpic: "../../static/srcc/touxiang.jpg",
								username: "Vincent",
								sex: 0, //0代表是男生，1代表女生
								age: 25,
								isguangzhu: false,
								title: "打代码666",
								titlepic: "../../static/srcc/1.jpg",
								video: false,
								share: false,
								path: "深圳 龙岗",
								sharenum: 50,
								commentnum: 40,
								goodnum: 80

							},
							//分享的例子
							{
								userpic: "../../static/srcc/touxiang.jpg",
								username: "Vincent",
								sex: 0, //0代表是男生，1代表女生
								age: 25,
								isguangzhu: false,
								title: "打代码",
								titlepic: "",
								video: false,
								share: {
									title: "哈哈哈打代码",
									titlepic: "../../static/srcc/c2.jpg"
								},
								path: "深圳 龙岗",
								sharenum: 50,
								commentnum: 40,
								goodnum: 80
							
							},
							//视频的例子
							{
								userpic: "../../static/srcc/touxiang.jpg",
								username: "Vincent",
								sex: 1, //0代表是男生，1代表女生
								age: 25,
								isguangzhu: false,
								title: "打代码",
								titlepic: "../../static/srcc/c2.jpg",
								video: {
									looknum: "300万播放",
									long: "1.21"
								},
								share: false,
								path: "深圳 龙岗",
								sharenum: 50,
								commentnum: 40,
								goodnum: 80

							}

							
						]
					},
				]
			}
		},
		onReachBottom() {
			this.loadmore();
		},
		//监听下拉刷新的
		onPullDownRefresh(){
			
			this.getdata()
				
		
			
			}
		,
		methods: {
			// 上拉刷新
			getdata(){
				setTimeout(()=>{
				// 获取数据
				let arr = [{
								userpic: "../../static/srcc/touxiang.jpg",
								username: "Vincent",
								sex: 1, //0代表是男生，1代表女生
								age: 25,
								isguangzhu: false,
								title: "打代码",
								titlepic: "../../static/srcc/c2.jpg",
								video: {
									looknum: "300万播放",
									long: "1.21"
								},
								share: false,
								path: "深圳 龙岗",
								sharenum: 50,
								commentnum: 40,
								goodnum: 80

							},
							{
							
								userpic: "../../static/srcc/touxiang.jpg",
								username: "Vincent",
								sex: 0, //0代表是男生，1代表女生
								age: 25,
								isguangzhu: false,
								title: "打代码666",
								titlepic: "../../static/srcc/1.jpg",
								video: false,
								share: false,
								path: "深圳 龙岗",
								sharenum: 50,
								commentnum: 40,
								goodnum: 80
							
							},
							//分享的例子
							{
								userpic: "../../static/srcc/touxiang.jpg",
								username: "Vincent",
								sex: 0, //0代表是男生，1代表女生
								age: 25,
								isguangzhu: false,
								title: "打代码",
								titlepic: "",
								video: false,
								share: {
									title: "哈哈哈打代码",
									titlepic: "../../static/srcc/c2.jpg"
								},
								path: "深圳 龙岗",
								sharenum: 50,
								commentnum: 40,
								goodnum: 80
							
							}];
							this.tablist[this.tabindex].list=arr;
							uni.stopPullDownRefresh();
							
				//赋值
					},2000);
				//停止刷新
				
				},
			
			// 上拉加载
			loadmore(){
				//如果目前全等于加载更多我们就给他这个事件，不然就return
				if (this.tablist[this.tabindex].loadtext != "上拉加载更多") {
					return;
				}
				//修改状态
				this.tablist[this.tabindex].loadtext = "加载中...";
				//获取数据
				setTimeout(() => {
					//获取完成
					let obj = {
			
						userpic: "../../static/srcc/touxiang.jpg",
						username: "Vincent",
						sex: 0, //0代表是男生，1代表女生
						age: 25,
						isguangzhu: false,
						title: "打代码666",
						titlepic: "../../static/srcc/c2.jpg",
						video: false,
						share: false,
						path: "深圳 龙岗",
						sharenum: 50,
						commentnum: 40,
						goodnum: 80
			
					};
			
			
					this.tablist[this.tabindex].list.push(obj);
					this.tablist[this.tabindex].loadtext = "上拉加载更多"
				}, 1000);
			
			
			},
			tabtap(index) {
				this.tabindex = index;

			}
		}
	}
</script>

<style>

</style>
